<template>
	<div class="main fx">
		<div class="mainx fx">
			<div class="mainx_c fx">
				<div class="mainx_cr fx">

					<div class="mainx_crx fx">
						<div class="mainx_cr_u fx">
							<div class="mainx_cr_uL fx">
								简历投递 / 岗位列表
							</div>
							<!-- <div class="mainx_cr_uR fx">
								<div class="mainx_cr_uR1 fx" @click="toP" style="margin-right: 30px;">
									企业员工管理
								</div>
								<div class="mainx_cr_uR1 fx" @click="toG" style="margin-right: 30px;">
									企业岗位管理
								</div>
							</div> -->

						</div>

						<el-table :data="datalist" :cell-style="{'font-size': '18px'}" :row-style="{'font-size': '18px'}" border stripe highlight-current-row max-height="800" size="small"
							style="width: 100%;min-width: 800px;font-size: 18px;">
							<el-table-column sortable type="index" align="center" width="70" label="序号">
							</el-table-column>
							<el-table-column prop="staffName" align="center" width="350" label="岗位名称"> </el-table-column>
							<el-table-column prop="job_count" sortable align="center" label="职位人数"
								width="120"></el-table-column>
							<el-table-column prop="salary" align="center" label="工资" min-width="10%"></el-table-column>


							<!--操作按钮开始-->
							<el-table-column label="操作" align="center" width="250">
								<template #default="scope">
									<el-button type="success" size="mini" style="background-color: #3e72adff;"
										@click="handleEdit(scope.$index, scope.row)">详情</el-button>
									<el-button type="success" size="mini" style="background-color: #3e72adff;"
										@click="handleDelete(scope.$index, scope.row)">投递简历</el-button>
								</template>
							</el-table-column>
							<!--操作按钮结束-->

						</el-table>

						<!--分页-->
						<el-pagination @current-change="handleCurrentChange" :current-page="page1.currentPage"
							:page-size="page1.pageSize" background layout="prev, pager, next" :total="page1.totalCount"
							style="float: right; margin: 10px 20px 0 0">
						</el-pagination>

					</div>


				</div>





			</div>
		</div>


		<el-dialog v-model="s_edit" top='60px' width="800">
			<div class="padd fx">
				<div class="fx" style="height: 30px;font-weight: bold;font-size: 16px;">
					{{title}}
				</div>
				
				<div class="padd_u fx">
					<div class="padd_ul fx">
						岗位名称
					</div>
					<div class="padd_ur fx">
						<input type="text" v-model="form1.name" placeholder="请输入岗位名称" />
					</div>
				</div>
				<div class="padd_u fx">
					<div class="padd_ul fx">
						职位人数
					</div>
					<div class="padd_ur fx">
						<input type="text" v-model="form1.job_count" placeholder="请输入职位人数" />
					</div>
				</div>
				<div class="padd_u fx">
					<div class="padd_ul fx">
						工资
					</div>
					<div class="padd_ur fx">
						<input type="text" v-model="form1.salary" placeholder="请输入工资" />
					</div>
				</div>
				<div class="padd_u fx">
					<div class="padd_ul fx">
						描述
					</div>
					<div class="padd_ur fx">
						<input type="text" v-model="form1.requirement" placeholder="请输入描述" />
					</div>
				</div>
				<div class="padd_u fx">
					<div class="padd_ul fx">
						工作地点
					</div>
					<div class="padd_ur fx">
						<input type="text" v-model="form1.education" placeholder="请输入工作地点" />
					</div>
				</div>
			<!-- 	<div class="padd_u fx">
					<div class="padd_ul fx">
						要求
					</div>
					<div class="padd_ur fx">
						<input type="text" v-model="form1.education" placeholder="请输入要求" />
					</div>
				</div> -->
				<!-- <div class="padd_u fx">
					<div class="padd_ul fx">
						用户Id
					</div>
					<div class="padd_ur fx">
						<input type="text" v-model="form1.usrId" placeholder="请输入联系方式" />
					</div>
				</div>
				<div class="padd_u fx">
					<div class="padd_ul fx">
						企业Id
					</div>
					<div class="padd_ur fx">
						<input type="text" v-model="form1.enterpriseId" placeholder="请输入联系方式" />
					</div>
				</div> -->


				<div class="btn fx" @click="sub()" v-if="stype==1">
					提交
				</div>

			</div>
		</el-dialog>


	</div>
</template>

<script>

import {useAccountStore} from "@/stores/account";
	import request from "@/api/http";
	import {
		ElMessage
	} from 'element-plus'
	export default {
		data() {
			return {
				datalist: [
					// {
					// 	staffName:'张三',
					// 	staffPosition:'组长',
					// 	contackWay:'13904057582',
					// },
					// {
					// 	staffName:'张三',
					// 	staffPosition:'组长',
					// 	contackWay:'13904057582',
					// }
				], //表格数据
				page1: {
					currentPage: 1, // 当前页
					pageSize: 10, // 每页显示条目个数
					totalCount: 2, // 总条目数
				},
				s_edit: false,
				title:"",
				
				stype:1,//1新增 2详情
				
				
				form1:{
					name:"",//员工姓名
					salary:"",//员工职位
					job_count:"",//员工职位
					requirement:"",//联系方式
					place:"",//用户id
					education:"",//企业密钥
				},//表单信息

				accountStore: useAccountStore()

			}
		},
		mounted() {
			console.log(276666)
			console.log(this.accountStore)
			// console.log(this.accountStore.user)
			console.log(28888)
			console.log(this.accountStore.enterprise.enterpriseId)
			console.log(this.accountStore.enterprise)
			 this.init();
		},
		methods: {
			toP(){
				this.$router.push('/addstaff')
			},
			toG(){
				this.$router.push('/position')
			},
			init(){
				request({
				    url: `/enterprise/get_all_jobs`,
				    method: 'get',
				    data: {
				        // enterpriseld: this.accountStore?.enterprise?.enterpriseId,//企业id/也可改成企业名
				    }
				}).then(res=>{
					console.log(11122);
					console.log(res);
					if(res?.list){
						res.list.map(v=>{
							v.staffName=v.name
							v.staffPosition=v.position
							v.contackWay=v.contact_way
						})
					}
					
					this.datalist=res?.list||[]
					
					
				})
			},
			sub(){
				console.log(25333);
				console.log(this.accountStore);
				console.log(this.accountStore.user.id);
				// return
				request({
				    url: `/enterprise/add_job`,
					// url: `/enterprise/add_employee`,
				    method: 'post',
				    data: {
				        name: this.form1.name,//员工姓名
				        salary: this.form1.salary,//员工职位
						job_count: this.form1.job_count,//员工职位
				        requirement: this.form1.requirement,//联系方式
				        place: this.form1.place,//要添加的员工id 1
				        education: this.form1.education,//企业id/也可改成企业名 5
				        enterpriseId: this.accountStore?.enterprise?.enterpriseId,//企业id/也可改成企业名 5
				        usrId: this.accountStore.user.id,//
				    }
				}).then(res=>{
					console.log(67888);
					console.log(res);
					if(res.errno==1){
						this.init();
						this.s_edit=false
						ElMessage.success("添加成功");
					}else{
						ElMessage.error(`${res.msg}`)
					}
				})
			},
			handleDelete(index, row) {
				console.log(6788);
				console.log(row);
				this.$confirm("确认要向该岗位投递简历吗?", "提示", {
						confirmButtonText: "确定",
						cancelButtonText: "取消",
						type: "warning",
					})
					.then(() => {
						console.log(6888);
						console.log(row);
						// return
						
						request({
						    url: '/enterprise/postResume',
						    method: 'post',
						    data: {
								// enterpriseId:this.accountStore?.enterprise?.enterpriseId,
								jobId:row.id
								
						    }
						}).then(res=>{
							console.log(67888);
							console.log(res);
							if(res.errno==1){
								this.init()
								ElMessage.success("投递成功");
							}else{
								ElMessage.error(`${res.msg}`)
							}
						})
						
						
						
					})
					.catch(() => {});
			},
			handleEdit(idx,key){
				this.title="岗位信息详情"
				this.s_edit=true
				this.stype=2
				this.form1={
					...key
				}
			},
			add(){
				this.title="新增岗位"
				this.s_edit=true
				this.stype=1
				this.form1={
					name:"",//员工姓名
					salary:"",//员工职位
					job_count:"",//员工职位
					requirement:"",//联系方式
					place:"",//用户id
					education:"",//企业密钥
				}//表单信息
			}
			
		}
	}
</script>

<style scoped>
	.fx{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
	}
	.main {
		width: 100%;
		height: 100vh;
		box-sizing: border-box;
		overflow: hidden;
		overflow-y: auto;
	}
	.mainx {
		flex-direction: column;
		justify-content: flex-start;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		padding: 0px 30px;
		padding-top: 0px;
		background-color: #f1f3f5f7;
	
	}
	.mainx_u {
		height: 60px;
		flex-shrink: 0;
		font-size: 20px;
		font-weight: bold;
		color: #000000f7;
		letter-spacing: 4px;
		box-sizing: border-box;
		padding-right: 20px;
		
		background-color: #fffffff7;
	}
	.mainx_ul {
		font-weight: bold;
		letter-spacing: 4px;
	}
	
	.mainx_ur {
		flex-shrink: 0;
		width: auto;
		height: 30px;
		letter-spacing: 2px;
		color: #fffffff7;
		border: 1px solid #00aafff7;
		background-color: #00aafff7;
		cursor: pointer;
		font-size: 14px;
		padding: 0px 20px;
		border-radius: 6px;
	}
	.mainx_ur:hover {
		background-color: #009debf7;
		color: #fffffff7;
	}
		
	.mainx_c {
		margin-top: 20px;
		align-items: flex-start;
		height: 100%;
	}
	.mainx_cl {
		flex-direction: column;
		justify-content: flex-start;
		height: 100%;
		width: 130px;
		flex-shrink: 0;
		background-color: #009debf7;
		background-color: #fffffff7;
	}
	
	.mainx_cl1 {
		margin-top: 5px;
		height: 50px;
		box-sizing: border-box;
		color: #000000f7;
		font-weight: bold;
		font-size: 14px;
		letter-spacing: 1px;
		cursor: pointer;
	}
	
	.mainx_cl1:first-of-type {
		margin-top: 0px;
	}
	
	.mainx_cl1:hover {
		color: #fffffff7;
		background-color: #009debf7;
	}
		
	.actv {
		color: #fffffff7;
		background-color: #009debf7;
	}
	
	
	.mainx_cr {
		/* margin-left: 20px; */
		flex-direction: column;
		height: 100%;
		justify-content: flex-start;
		background-color: #fffffff7;
	}
	
	.mainx_crx {
		flex-direction: column;
		height: 100%;
		justify-content: flex-start;
		box-sizing: border-box;
		padding: 0 20px;
	}
		
	.mainx_cr_u {
		min-height: 100px;
		height: auto;
		width: 100%;
		padding: 0px 20px;
		box-sizing: border-box;
	}
	
	.mainx_cr_uL {
		margin-top: 20px;
		float: left;
		width: 100%;
		height: 40px;
		font-weight: bold;
		justify-content: flex-start;
	}
	
	.mainx_cr_uR {
		justify-content: flex-end;
	}
	.mainx_cr_uR1{
		flex-shrink: 0;
		width: auto;
		height: 30px;
		letter-spacing: 2px;
		color: #fffffff7;
		border: 1px solid #00aafff7;
		background-color: #3e72adff;
		cursor: pointer;
		font-size: 14px;
		padding: 0px 20px;
		border-radius: 6px;
	}
	.mainx_cr_uR1:hover {
		background-color: #009debf7;
		color: #fffffff7;
	}
	
	
	

	.padd {
		width: 100%;
		height: auto;
		padding-bottom: 30px;
		flex-direction: column;
		justify-content: flex-start;
	}
	
	.padd_u {
		margin-top: 20px;
		height: 40px;
		width: 80%;
	}
	.padd_u:first-of-type {
		margin-top: 0px;
	}
		
	.padd_ul {
		width: 140px;
		flex-shrink: 0;
		background-color: #f1f3f7;
	}
		
	.padd_ur {
		background-color: #ffff00f7;
	}
	.padd_ur input {
		width: 100%;
		height: 100%;
		border: 2px solid #f1f3f7;
		padding-left: 30px;
		box-sizing: border-box;
	}
	
	.padd_ur input:focus {
		/* border: 1px solid #1aa094; */
		outline: 1px solid #00aaff;
	}
	
	.btn {
		width: 60%;
		height: 40px;
		border-radius: 8px;
		background-color: #3e72adff;
		color: #fff;
		font-size: 16px;
		cursor: pointer;
		margin-top: 30px;
	}
	
	.mylabel{
		font-size: 28px;
	}
</style>